<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/styles.css}"/>
    <style type="text/css">
        div.header{
            width: 100%;
            height:250px;

        }
        div.middle1{
            width:100%;
            height:400px;

        }
        div.footer{
            width: 100%;
            height:100px;
        }



        #right{
            float:right;
            width: 20%;
            height: 100%;
            style:"DISPLAY: none;"
        }
        #middle{
            height: 100%;
            width :auto;
            float: contour;
        }
        button {
            width :120px;
            height :64px;
            font-size: 24px;
        }
    </style>
</head>
<script type="text/javascript"  src="../static/jquery-3.5.1/jquery-3.5.1.js" th:src="@{/jquery-3.5.1/jquery-3.5.1.js}"></script>
<script type="text/javascript" >
    function refundForm(n){
        console.log("退票");
        var  order= document.getElementById("order").value;
        var  phone= document.getElementById("phone").value;
        console.log(order);
        console.log(phone);
        $('#ord').val(order);
        $('#pho').val(phone);
        if(order==''||phone==''){
            alert("请输入票务相关信息");
        }else {
            var sale = "";
            $.ajax({
                url:'/seerefund',
                type:'post',
                sync:true,
                data:{
                    "order":order,
                    "phone":phone
                },
                dataType:'json',
                success:function (res){
                    console.log(res);

                    for (var i = 0; i < res.length; i++) {
                        sale += '<span>单号:' + res[i].order_Number + '&nbsp;</span><br><span>电话:' + res[i].phone + '&nbsp;</span><span>车号:' + res[i].car + '&nbsp;</span><br><span>目的地:' + res[i].destination + '&nbsp;</span><span>出发日期:' + res[i].dtime + '&nbsp;</span><br><span>出发时间:' + res[i].htimea + '&nbsp;</span><br><span>到达时间:' + res[i].htimeb+ '&nbsp;</span><br><span>金额:' + res[i].money + '</span><br>';
                    }
                    console.log(sale);
                    $('#tic').html(sale);
                    var a;
                    var div= document.getElementById('inputbox');
                    div.style.display = n ? 'block' : 'none';     /* 点击按钮打开/关闭 对话框 */
                    if (n) {
                        a = n.parentNode.getElementsByTagName('a')[0];
                        ipt = div.getElementsByTagName('input');
                        //ipt[0].value = null;
                    }
                }
            });
        }
    }
</script>
<body>
<div class="header">
    <img th:src="@{/0.jpeg}" width="100%" height="100px"/><br>
    <div align="right"><span class="clock">60</span>秒</div>
    <div align="center" style="font-size: 48px">退票界面</div>

</div>
<div class="middle1" >

    <div id="middle" >
<form method="post" th:action="@{/wel}">
    <table align="center">


        <tr>
            <td align="right">单号:</td>
            <td><input type="text" id="order" name="order"/></td>
        </tr>
        <tr>
            <td align="right">电话:</td>
            <td><input type="text" id="phone" name="phone"/></td>
        </tr>
        <tr>
            <td colspan="2" align="center" height="40"><input type="button"  value="确认" onclick="refundForm(this)"/></td>
        </tr>
        <tr>
            <td colspan="2" align="center" height="40"><input type="submit"  value="返回" /></td>
        </tr>
        <script>
            var t = 60;
            var time = document.getElementsByClassName("clock")[0];

            function fun() {
                t--;
                time.innerHTML = t;
                if(t <= 0) {
                    // clearInterval(inter);
                    // alert("aaa");
                    //document.location.href("www.baidu.com");
                    // window.location.href("www.baidu.com");
                    javaScript:history.go(-1);
                }
            }
            var inter = setInterval("fun()", 1000);
        </script>
    </table>
</form>
<div id='inputbox' class="box">
    <a class='x' href=''  onclick="refundForm(); return false;">关闭</a>
    <form method="post" th:action="@{/ref}">
        <table align="center">
            <tr>
                <input type="hidden" id="ord" name="ord">
                <input type="hidden" id="pho" name="pho">
            </tr>
            <tr>
                <div id="tic" align="center"></div>
            </tr>
            <tr>
                <td colspan="2" align="center" height="40"><input type="submit"  value="退票" /></td>
            </tr>
        </table>
    </form>
</div>
    </div>
    <div id="right"></div>
</div>
<div class="footer">
    <img th:src="@{/1.png}" width="100%" height="100px"/><br>
</div>
</body>
</html>